<template>
  <a-select v-bind="$attrs" :disabled="readonly" v-model="currentValue" :placeholder="placeholder" @change="handleChange" filterable style="width:100%">
    <a-select-option v-for="item in options" :key="item.code" :value="item.code">{{ item.name }}</a-select-option>
  </a-select>
</template>

<script>
// import { markeTypeSelector } from '@/api/meta'
export default {
  props: {
    value: {
      type: String,
      default: '',
    },
    placeholder: {
      type: String,
      default: '请选择',
    },
    classify: {
      type: String,
      default: '2'
    },
    parentId: {
      type: [String, Number],
      default: ''
    },
    readonly: {
      type: Boolean,
      default: false
    },
    productCode: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      options: [
        {
            'id': 4,
            'code': '1',
            'name': '功能页',
            'classify': '2',
            'parent_id': null
        },
        // {
        //     "id": 5,
        //     "code": "2",
        //     "name": "活动页",
        //     "classify": "2",
        //     "parent_id": null
        // },
        {
            'id': 6,
            'code': '3',
            'name': '外部H5',
            'classify': '2',
            'parent_id': null
        },
        {
            'id': 7,
            'code': '4',
            'name': '小程序',
            'classify': '2',
            'parent_id': null
        },
        // {
        //     "id": 90004,
        //     "code": "6",
        //     "name": "客服电话",
        //     "classify": "2",
        //     "parent_id": null
        // },
        {
            'id': 90005,
            'code': '5',
            'name': '不做跳转',
            'classify': '2',
            'parent_id': null
        }
      ],
      currentValue: this.value,
      loading: false,
    }
  },
  mounted () {
    // this.loadData()
  },
  methods: {
    handleChange (val) {
      this.options.forEach(v => {
        if (v.code == val) {
          this.$emit('change', v)
        }
      })
      if (!val) this.$emit('change', {})
      this.$emit('input', val)
    },
    loadData () {
      // const self = this
      // const { classify, productCode } = this
      // self.loading = true
      // markeTypeSelector({ classify, product_code: productCode })
      //   .then((res) => {
      //     self.loading = false
      //     self.options = res.data
      //     self.currentValue = self.value
      //   })
      //   .catch(() => {
      //     self.loading = false
      //   })
    },
  },

  watch: {
    value: {
      immediate: true,
      handler (val) {
        this.currentValue = val + ''
      }
    },
    classify (val) {
      if (val) {
        this.loadData()
      }
    },
    productCode: {
      immediate: true,
      handler (val, old) {
        if (val != old) {
          this.loadData()
        }
      }
    }
  },
}
</script>

<style lang="less"></style>
